<!--Created by 王成 on 2018/7/4.-->
<div class="x_panel">
    <ul class="breadcrumb">
        <li><span class="primary-font"><i class="icon-home"></i></span><a href="index.html"> Home</a></li>
        <li>用户</li>
        <li>添加用户</li>
    </ul>
    <div class="smart-widget">
        <div class="smart-widget-header">
            添加列表
        </div>
        <div class="smart-widget-inner">
            <div class="smart-widget-body">
                <div class="row">
                    <div class="padding-md">
                        <form id="defaultForm" data-parsley-validate=""
                              class="form-horizontal form-label-left" novalidate="" method="post">
                            <div class="form-group">
                                <label class="control-label col-md-3 col-sm-3 col-xs-12">用户名称
                                </label>
                                <div class="col-md-6 col-sm-6 col-xs-12">
                                    <input type="text" name="empName" id="empName" required="required"
                                           oninvalid="setCustomValidity('请输入用户名称');"
                                           class="form-control col-md-7 col-xs-12"/>
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="control-label col-md-3 col-sm-3 col-xs-12">用户账号
                                </label>
                                <div class="col-md-6 col-sm-6 col-xs-12">
                                    <input type="text" name="empLogin" id="empLogin" required="required"
                                           oninvalid="setCustomValidity('请输入用户账号');"
                                           class="form-control col-md-7 col-xs-12"/>
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="control-label col-md-3 col-sm-3 col-xs-12">用户密码
                                </label>
                                <div class="col-md-6 col-sm-6 col-xs-12">
                                    <input type="text" name="empPwd" required="required"
                                           oninvalid="setCustomValidity('请输入用户密码');"
                                           class="form-control col-md-7 col-xs-12" readonly="readonly" value="123456"/>
                                </div>
                            </div>


                            <div class="form-group">
                                <label class="control-label col-md-3 col-sm-3 col-xs-12">性别</label>
                                <div class="col-md-6 col-sm-6 col-xs-12 radio radio-success in_on">
                                    <input type="hidden" id="mode2" name="empSex"/>
                                    <div class="col-md-6 ">
                                        <input type="radio" id="start3" name="sex" value="0"/><label>男</label>
                                    </div>
                                    <div class="col-md-6 ">
                                        <input type="radio" id="start4" name="sex" value="1"/><label>女</label>
                                    </div>
                                    <!--<div class="col-md-6 ">-->
                                    <!--<input type="radio" id="start8" name="sex" value="1"/>-->
                                    <!--</div>-->
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="control-label col-md-3 col-sm-3 col-xs-12">公司名称</label>
                                <div class="col-md-6 col-sm-6 col-xs-12">
                                    <input type="text" name="CorporateName" id="CorporateName" required="required"
                                           oninvalid="setCustomValidity('请输入公司名称');"
                                           class="form-control col-md-7 col-xs-12"/>
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="control-label col-md-3 col-sm-3 col-xs-12">部门名称</label>
                                <input type="hidden" name="orgId" id="orgId" value=""/>
                                <div class="col-md-6 col-sm-6 col-xs-12">
                                    <div class="input-group col-md-12">
                                        <input type="text" class="form-control" name="orgName" readonly="readonly"/>
                                        <span class="input-group-btn"
                                              style="position: absolute;right: 28px;z-index: 100">
                              <button type="button" class="btn btn-primary" data-toggle="modal"
                                      data-target="#myModal">+</button>
                        </span>
                                    </div>
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="control-label col-md-3 col-sm-3 col-xs-12">手机号</label>
                                <div class="col-md-6 col-sm-6 col-xs-12">
                                    <input type="text" name="empTel" id="empTel" required="required"
                                           oninvalid="setCustomValidity('请输入手机号码');"
                                           class="form-control col-md-7 col-xs-12"/>
                                </div>
                            </div>





                            <div class="form-group">
                                <div class="col-md-6 col-sm-6 col-xs-12 col-md-offset-3">

                                    <button type="button" id="validateBtn" class="btn btn-primary">保存</button>
                                    <button class="btn btn-primary" onclick="reset()" id="resetBtn" type="button">重置
                                    </button>
                                    <button id="back" onclick="backToList()" class="btn btn-success" type="button">返回</button>
                                </div>
                            </div>
                        </form>
                    </div>
                </div><!-- ./row -->
            </div>
        </div><!-- ./smart-widget-inner -->
    </div><!-- ./smart-widget -->
</div>
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">
                    &times;
                </button>
                <h4 class="modal-title" id="myModalLabel">
                    部门名称
                </h4>
            </div>
            <ul id="treeDemo2" class="ztree"></ul>

            <!--<div class="tree well" id="tree" style="height: 200px;overflow: scroll;z-index: 110"></div>-->
            <div class="modal-footer">
                <button type="button" class="btn btn-primary" id="send" onclick="send()">
                    确定
                </button>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal -->
</div>
<style>
    .in_on i {
        opacity: 0
    }
</style>


<script type="text/javascript" th:inline="javascript">


    $(document).ready(function () {
        $('#defaultForm').bootstrapValidator({
//        live: 'disabled',
            message: 'This value is not valid',
            feedbackIcons: {
                valid: 'glyphicon glyphicon-ok',
                invalid: 'glyphicon glyphicon-remove',
                validating: 'glyphicon glyphicon-refresh'
            },
            fields: {  //start

                orgName: {
                    validators: {
                        notEmpty: {
                            message: '请选择部门'
                        }
                    }
                },
                sex: {
                    validators: {
                        notEmpty: {
                            message: '请选择性别'
                        }
                    }
                },
                CorporateName: {
                    validators: {
                        notEmpty: {
                            message: '公司名称不能为空'
                        }
                    }
                },
                empTel: {
                    validators: {
                        notEmpty: {
                            message: '手机号不能为空'
                        },
                        stringLength: {
                            min: 11,
                            max: 11,
                            message: '请输入11位手机号码'
                        },
                        regexp: {
                            regexp: /^1[3|5|8|7]{1}[0-9]{9}$/,
                            message: '请输入正确的手机号码'
                        }
                    }
                },

                empLogin: {
                    validators: {
                        notEmpty: {
                            message: '请输入用户账号'
                        }
                    }
                },
                empPwd: {
                    validators: {
                        notEmpty: {
                            message: '请输入用户密码'
                        }
                    }
                },
                empName: {
                    validators: {
                        notEmpty: {
                            message: '请输入用户名称'
                        }
                    }
                },

            }
        });


        $("#empName").change(function () {
            $('#defaultForm').data('bootstrapValidator').updateStatus('empName', 'NOT_VALIDATED', null).validateField('empName');
        });
        $("#empLogin").change(function () {
            $('#defaultForm').data('bootstrapValidator').updateStatus('empLogin', 'NOT_VALIDATED', null).validateField('empLogin');
        });
        $("#empTel").change(function () {
            $('#defaultForm').data('bootstrapValidator').updateStatus('empTel', 'NOT_VALIDATED', null).validateField('empTel');
        });


        // Validate the form manually
        $('#validateBtn').click(function () {
            $('form').bootstrapValidator('validate').data('bootstrapValidator').updateStatus('orgName', 'NOT_VALIDATED', null).validateField('orgName');
            $('form').bootstrapValidator('validate').data('bootstrapValidator').updateStatus('roleName', 'NOT_VALIDATED', null).validateField('roleName');
            $('form').bootstrapValidator('validate');
            var flag = $('form').data('bootstrapValidator').isValid();
            if (flag) {
                $('#validateBtn').attr("disabled", "disabled");
                // $('#validateBtn').attr("disabled","disabled");
                // Validate the form manually
                var empName = $("input[name=empName]").val();
                var empLogin = $("input[name=empLogin]").val();
                $("input[name=empMode]").val($("input[name='start']:checked").val());
                $("input[name=empSex]").val($("input[name='sex']:checked").val());
                var empTel = $("input[name=empTel]").val();
                var SaveAndFlush = $("#defaultForm").serialize();
                $.post("/emp/checkEmpInfo", {
                    "empName": empName,
                    "empLogin": empLogin,
                    "empTel": empTel
                }, function (result) {
                    if (result == "BH") {
                        $.MsgBox.Alert("提示", "用户编号已重复！");
                    } else if (result == "MC") {
                        $.MsgBox.Alert("提示", "用户名称已重复！");
                        $("input[name=empName]").val("").change();
                        $('#validateBtn').removeAttr("disabled");
                    } else if (result == "ZH") {
                        $.MsgBox.Alert("提示", "用户账号已重复！");
                        $("input[name=empLogin]").val("").change();
                        $('#validateBtn').removeAttr("disabled");
                    } else if (result == "SJ") {
                        $.MsgBox.Alert("提示", "手机号码已重复！");
                        $("input[name=empTel]").val("").change();
                        $('#validateBtn').removeAttr("disabled");
                    } else {
                        $.post("/emp/save", SaveAndFlush, function (result2) {
                            if (result2 != null) {
                                $.MsgBox.Alert("提示", "存入成功");
                                $.goTo("toEmpList");
                            }
                        });
                    }
                });
                $('#validateBtn').removeAttr("disabled");
            } else {
                $('#validateBtn').removeAttr("disabled");
                return;
            }
        });
        $('#resetBtn').click(function () {//重置
            $('form').data('bootstrapValidator').resetForm(true);
            $("input[name=empPwd]").val("123456");
        });
        $("form").each(function () {
            var $form = $(this);
            $form.bootstrapValidator().on('success.form.bv', function (e) {
                // 阻止默认事件提交
                e.preventDefault();
            });
        });
    });
</script>
<script type="text/javascript" th:inline="javascript">

    /*<![CDATA[*/
    function backToList() {
        $.goTo('/user/userList.html')
    }

    var zTreeObj,
        setting = {
            view: {
                selectedMulti: false
            },
            check: {
                enable: true
            },
            data: {
                simpleData: {
                    enable: true
                }
            }
        },
        zTreeNodes = [
            {
                "name": "网站导航", open: true, children: [
                {"name": "google", "url": "http://g.cn", "target": "_blank"},
                {"name": "baidu", "url": "http://baidu.com", "target": "_blank"},
                {"name": "sina", "url": "http://www.sina.com.cn", "target": "_blank"}
            ]
            },
            {
                "name": "网站导航", open: true, children: [
                {"name": "google", "url": "http://g.cn", "target": "_blank"},
                {"name": "baidu", "url": "http://baidu.com", "target": "_blank"},
                {"name": "sina", "url": "http://www.sina.com.cn", "target": "_blank"}
            ]
            },
            {
                "name": "网站导航", open: true, children: [
                {"name": "google", "url": "http://g.cn", "target": "_blank"},
                {"name": "baidu", "url": "http://baidu.com", "target": "_blank"},
                {"name": "sina", "url": "http://www.sina.com.cn", "target": "_blank"}
            ]
            }
        ];

    $(document).ready(function () {
        zTreeObj = $.fn.zTree.init($("#treeDemo2"), setting, zTreeNodes);

    });
    function send() {
        $("#myModal").modal('hide')
    }
    /*]]>*/
</script>
